import 'package:flutter/material.dart';
import '../../manger/global_config.dart';
import 'package:ninetyfour/l10n/app_localizations.dart';

typedef OrderTabCallback = void Function(int index);
typedef FilterCallback = void Function();

class OrderTopView extends StatefulWidget {
  final OrderTabCallback onTabSelected;
  final FilterCallback onFilter;
  final FilterCallback onSearch;

  const OrderTopView({
    super.key,
    required this.onTabSelected,
    required this.onFilter,
    required this.onSearch,
  });

  @override
  State<OrderTopView> createState() => _OrderTopViewState();
}

class _OrderTopViewState extends State<OrderTopView> {
  int _selectedIndex = 0;

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        _buildTitleBar(context),
        _buildTabBar(context),
      ],
    );
  }

  Widget _buildTitleBar(BuildContext context) {
    const double statusBarHeight = 7;
    final localizations = AppLocalizations.of(context)!;
    return Container(
      height: GlobalConfig.navContentBarHeight + GlobalConfig.getStatusBarHeight(context) + statusBarHeight,
      padding: EdgeInsets.only(top: 0),
      color: Color(0xFFF8F6F7),
      child: Stack(
        children: [
          Positioned(
            left: 0,
            right: 0,
            top:  statusBarHeight + GlobalConfig.getStatusBarHeight(context),
            child: Center(
              child: Text(
                localizations.profileOrder,
                style: TextStyle(
                  color: GlobalConfig.labelColor,
                  fontSize: 16,
                ),
              ),
            ),
          ),
          Positioned(
            right: 15,
            top:  statusBarHeight + GlobalConfig.getStatusBarHeight(context),
            child: GestureDetector(
              onTap: widget.onSearch,
              child: Image.asset(
                'assets/images/sousuo.png',
                width: 22,
                height: 22,
              ),
            ),
          ),
          Positioned(
            right: 57, // 15 + 22 + 20
            top:  statusBarHeight + GlobalConfig.getStatusBarHeight(context),
            child: GestureDetector(
              onTap: widget.onFilter,
              child: Image.asset(
                'assets/images/shaixuan.png',
                width: 22,
                height: 22,
              ),
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildTabBar(BuildContext context) {
    final localizations = AppLocalizations.of(context)!;
    return Container(
      margin: const EdgeInsets.symmetric(horizontal: 15, vertical: 0),
      decoration: BoxDecoration(
        color: GlobalConfig.titleBlueColor,
        borderRadius: BorderRadius.circular(17),
      ),
      height: 34,
      child: Row(
        children: List.generate(5, (index) {
          final isSelected = index == _selectedIndex;
          String title;
          switch (index) {
            case 0:
              title = localizations.all;
              break;
            case 1:
              title = localizations.pendingPayment;
              break;
            case 2:
              title = localizations.pendingShipment;
              break;
            case 3:
              title = localizations.pendingDelivery;
              break;
            case 4:
              title = localizations.completed;
              break;
            default:
              title = '';
          }
          return Expanded(
            child: GestureDetector(
              onTap: () {
                setState(() => _selectedIndex = index);
                widget.onTabSelected(index);
              },
              child: Container(
                margin: const EdgeInsets.all(2),
                decoration: BoxDecoration(
                  color: isSelected ? Colors.white : Colors.transparent,
                  borderRadius: BorderRadius.circular(15),
                ),
                alignment: Alignment.center,
                child: Text(
                  title,
                  style: TextStyle(
                    color: isSelected ? GlobalConfig.titleBlueColor : Colors.white,
                    fontSize: isChineseLocale() ? 14 : 13,
                  ),
                ),
              ),
            ),
          );
        }),
      ),
    );
  }
}